<template>
  <div>
    <el-dialog
      title="结构中心"
      :visible.sync="show"
      width="30rem"
      :before-close="closeDialog"
    >

      <div style="width:100%">
        <el-tree
          :data="routerInfo"
          :props="defaultProps"
          node-key="position"
          :render-content="renderContent"
        />
      </div>
      <el-button class="show-router-info-button" type="text" @click="append()">添加一级路由</el-button>
    </el-dialog>
    <!-- 添加权限 -->
    <el-dialog
      title="添加结构"
      :visible.sync="showInfo"
      width="30rem"
      :before-close="closeInfoDialog"
    >
      <el-form ref="form" label-position="left" :model="routerInfomation" label-width="10rem">
        <el-form-item label="路由名称" required="">
          <el-input
            v-model="routerInfomation.name"
            clearable
            maxlength="5"
            show-word-limit
            style="width:15rem"
          />
        </el-form-item>
        <el-form-item label="路由状态" required="">
          <template>
            <el-select v-model="routerInfomation.showStatus" filterable style="width:15rem">
              <el-option
                v-for="item in statusType"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </template>
        </el-form-item>
        <el-form-item v-if="routerInfomation.level !== 1" label="路由类型" required="">
          <template>
            <el-select v-model="routerInfomation.type" filterable style="width:15rem">
              <el-option
                v-for="item in listTypes"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </template>
        </el-form-item>
        <el-form-item v-if="routerInfomation.level !== 1" label="用户权限" required="">
          <template>
            <el-select v-model="routerInfomation.userType" filterable style="width:15rem">
              <el-option
                v-for="item in allJurisdiction"
                :key="item.jurisdictionId"
                :label="item.jurisdictionName"
                :value="item.jurisdictionId"
              />
            </el-select>
          </template>
        </el-form-item>
        <el-form-item label="标题内容" required="">
          <el-input
            v-model="routerInfomation.info"
            type="textarea"
            style="width:15rem"
            autosize
            placeholder="请输入标题内容"
          />
        </el-form-item>
        <template v-if="routerInfomation.type === 2 ||routerInfomation.type === 3">
          <el-form-item label="评分类型" required="">
            <el-select v-model="routerInfomation.scoreType" placeholder="请选择" style="width:15rem">
              <el-option
                v-for="item in scoreType"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              />
            </el-select>
          </el-form-item>
        </template>
        <template v-if="routerInfomation.type !== 5">
          <el-form-item label="基础分" required="">
            <el-input
              v-model="routerInfomation.baseScore"
              style="width:15rem"
              placeholder="请输入基础分"
              oninput="value=value.replace(/^\.+|[^\d.-]/g,'')"
              maxlength="5"
              clearable
            />
          </el-form-item>
          <el-form-item label="最高分" required="">
            <el-input
              v-model="routerInfomation.maxScore"
              style="width:15rem"
              placeholder="请输入最高分"
              oninput="value=value.replace(/^\.+|[^\d.-]/g,'')"
              maxlength="5"
              clearable
            />
          </el-form-item>
          <el-form-item label="最低分" required="">
            <el-input
              v-model="routerInfomation.minScore"
              style="width:15rem"
              placeholder="请输入最低分"
              oninput="value=value.replace(/^\.+|[^\d.-]/g,'')"
              maxlength="5"
              clearable
            />
          </el-form-item>
        </template>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="closeInfoDialog()">取 消</el-button>
        <el-button type="primary" @click="sendRouterInfo()">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { getAllJurisdiction } from '@/api/jurisdiction.js'
import { getAllRouter } from '../../api/user.js'
import { addSlist, delSlist } from '@/api/slist.js'
import { addTlist, delTlist } from '@/api/tlist.js'
import { addFlist, delFlist } from '@/api/flist.js'
export default {
  data() {
    return {
      // 后台获取数据
      routerInfo: [],
      routerInfomation: {},
      routerInfoSession: {},
      // 页面存储数据
      show: false,
      showInfo: false,
      defaultProps: {
        children: 'child',
        label: 'name'
      },
      allJurisdiction: [],
      listTypes: [
        {
          label: '考核制',
          value: 1
        },
        {
          label: '评分制',
          value: 2
        },
        {
          label: '审核评分制',
          value: 3
        },
        {
          label: '一票否决制',
          value: 5
        }
      ], // 评分类型选择
      statusType: [
        {
          label: '上架',
          value: 1
        },
        {
          label: '未上架',
          value: 2
        }
      ],
      scoreType: [
        {
          label: '加分制',
          value: 1
        },
        {
          label: '扣分制',
          value: 2
        },
        {
          label: '有加有扣制',
          value: 3
        }
      ]
    }
  },
  created() {
    // dialog信息初始化
    this.createDialogStatus()
  },
  methods: {
    // dialog信息初始化
    createDialogStatus() {
      this.show = false
    },
    // 展示dialog信息
    showDialog() {
      this.show = true
      this.getAllRouterInfo()
    },
    // 获取全部路由信息
    getAllRouterInfo() {
      getAllRouter().then((res) => {
        const routerInfo = []
        for (const i in res.obj) {
          const flist = {}
          // 添加一级标题信息
          flist.id = res.obj[i].flist.flistId
          flist.name = res.obj[i].flist.flistName
          flist.maxScore = res.obj[i].flist.flistMaxScore
          flist.minScore = res.obj[i].flist.flistMinScore
          flist.position = res.obj[i].flist.flistPosition
          flist.path = res.obj[i].flist.flistPath
          flist.level = 1
          flist.child = []
          // 如果存在二级标题
          if (res.obj[i].slists.length === 0) {
            routerInfo.push(flist)
            continue
          } else {
            for (const j in res.obj[i].slists) {
              const slist = {}
              slist.id = res.obj[i].slists[j].slist.slistId
              slist.name = res.obj[i].slists[j].slist.slistName
              slist.maxScore = res.obj[i].slists[j].slist.slistMaxScore
              slist.minScore = res.obj[i].slists[j].slist.slistMinScore
              slist.position = res.obj[i].slists[j].slist.slistPosition
              slist.path = res.obj[i].slists[j].slist.slistPath
              slist.flistId = res.obj[i].flist.flistId
              slist.level = 2
              slist.child = []
              // 判断当前二级标题是否有三级标题
              if (res.obj[i].slists[j].tlist.length === 0) {
                flist.child.push(slist)
                continue
              } else {
                for (let x = 0; x < res.obj[i].slists[j].tlist.length; x++) {
                  const tlist = {}
                  tlist.id = res.obj[i].slists[j].tlist[x].tlistId
                  tlist.name = res.obj[i].slists[j].tlist[x].tlistName
                  tlist.maxScore = res.obj[i].slists[j].tlist[x].tlistMaxScore
                  tlist.minScore = res.obj[i].slists[j].tlist[x].tlistMinScore
                  tlist.position = res.obj[i].slists[j].tlist[x].tlistPosition
                  tlist.path = res.obj[i].slists[j].tlist[x].tlistPath
                  tlist.flistId = res.obj[i].flist.flistId
                  tlist.slisId = res.obj[i].slists[j].slist.slistId
                  tlist.level = 3
                  slist.child.push(tlist)
                }
                flist.child.push(slist)
              }
            }
            routerInfo.push(flist)
          }
        }
        this.routerInfo = routerInfo
      })
    },
    // 关闭dialog
    closeDialog() {
      this.show = false
      this.routerInfo = []
    },
    closeInfoDialog() {
      this.showInfo = false
      this.routerInfomation = {}
    },

    renderContent(h, { node, data, store }) {
      if (data.level !== 3 && data.path === '/publicMark') {
        if (data.child.length !== 0) {
          return (
            <span style='width:100%'>
              <span style='float:left;padding-top:0.35rem'>{node.label}</span>
              <span style='float:right'>
                <el-button size='mini' type='text' on-click={ () => this.append(data) }>添加</el-button>
                <el-button size='mini' type='text' on-click={ () => this.delRouter(data) } style='color:#e74c3c'>删除</el-button>
              </span>
            </span>
          )
        } else {
          return (
            <span style='width:100%'>
              <span style='float:left;padding-top:0.35rem'>{node.label}</span>
              <span style='float:right'>
                <el-button size='mini' type='text' on-click={ () => this.append(data) }>添加</el-button>
                <el-button size='mini' type='text' on-click={() => { this.delRouter(data) }} style='color:#e74c3c'>删除</el-button>
              </span>
            </span>
          )
        }
      } else {
        if (data.level === 3) {
          return (
            <span style='width:100%'>
              <span style='float:left;padding-top:0.35rem'>{node.label}</span>
              <span style='float:right'>
                <el-button size='mini' type='text' on-click={() => { this.delRouter(data) }} style='color:#e74c3c'>删除</el-button>
              </span>
            </span>
          )
        } else {
          return (
            <span class='custom-tree-node'>
              <span>{node.label}</span>
            </span>
          )
        }
      }
    },
    delRouter(routerInfo) {
      this.$confirm('是否确定删除，删除后不可恢复?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        if (routerInfo.level === 3) {
          delTlist(routerInfo.id).then((res) => {
            this.$message({
              message: '删除成功',
              type: 'success'
            })
            this.showDialog()
            this.$emit('reloadInfo', 0)
          })
        } else if (routerInfo.level === 2) {
          delSlist(routerInfo.id).then((res) => {
            this.$message({
              message: '删除成功',
              type: 'success'
            })
            this.showDialog()
            this.$emit('reloadInfo', 0)
          })
        } else if (routerInfo.level === 1) {
          delFlist(routerInfo.id).then((res) => {
            this.$message({
              message: '删除成功',
              type: 'success'
            })
            this.showDialog()
            this.$emit('reloadInfo', 0)
          })
        }
      }).catch(() => {
      })
    },
    append(routerInfo) {
      var newChild = {}
      if (routerInfo === undefined) {
        newChild = {
          child: [],
          level: 1,
          name: '一级标题',
          position: Math.max.apply(Math, this.routerInfo.map(function(e) { return e.position })) !== -Infinity ? Math.max.apply(Math, this.routerInfo.map(function(e) { return e.position })) + 1 : 1,
          path: '/publicMark'
        }
      } else {
        if (routerInfo.level === 1) {
          newChild = {
            child: [],
            flistId: routerInfo.id,
            level: 2,
            name: '二级标题',
            position: Math.max.apply(Math, routerInfo.child.map(function(e) { return e.position })) !== -Infinity ? Math.max.apply(Math, routerInfo.child.map(function(e) { return e.position })) + 1 : 1,
            path: '/publicMark'
          }
        } else if (routerInfo.level === 2) {
          newChild = {
            child: [],
            flistId: routerInfo.flistId,
            slistId: routerInfo.id,
            level: 3,
            name: '三级标题',
            position: Math.max.apply(Math, routerInfo.child.map(function(e) { return e.position })) !== -Infinity ? Math.max.apply(Math, routerInfo.child.map(function(e) { return e.position })) + 1 : 1,
            path: '/publicMark'
          }
        }
      }

      getAllJurisdiction().then((res) => {
        const allJurisdiction = []
        for (const i in res.obj) {
          if (res.obj[i].jurisdictionId !== '0') {
            allJurisdiction.push(res.obj[i])
          }
        }
        this.allJurisdiction = allJurisdiction
        this.showInfo = true
        this.routerInfoSession = routerInfo
        this.routerInfomation = newChild
      })
    },
    sendRouterInfo() {
      // 路由判断
      var that = this
      var routerInfo = this.routerInfomation
      if (routerInfo.level === 1) {
        if (routerInfo.name === '' || routerInfo.name === null || routerInfo.name === undefined) {
          that.$message({
            message: '请填写标题名称',
            type: 'warning'
          })
        } else if (routerInfo.showStatus === '' || routerInfo.showStatus === null || routerInfo.showStatus === undefined) {
          that.$message({
            message: '请选择路由状态',
            type: 'warning'
          })
        } else if (routerInfo.info === '' || routerInfo.info === null || routerInfo.info === undefined) {
          that.$message({
            message: '请输入标题信息',
            type: 'warning'
          })
        } else if (routerInfo.baseScore === '' || routerInfo.baseScore === null || routerInfo.baseScore === undefined) {
          that.$message({
            message: '请输入基础分',
            type: 'warning'
          })
        } else if (routerInfo.maxScore === '' || routerInfo.maxScore === null || routerInfo.maxScore === undefined) {
          that.$message({
            message: '请输入最高分',
            type: 'warning'
          })
        } else if (routerInfo.minScore === '' || routerInfo.minScore === null || routerInfo.minScore === undefined) {
          that.$message({
            message: '请输入最低分',
            type: 'warning'
          })
        } else {
          // 开始提交
          that.addList()
        }
      } else {
        if (routerInfo.name === '' || routerInfo.name === null || routerInfo.name === undefined) {
          that.$message({
            message: '请填写标题名称',
            type: 'warning'
          })
        } else if (routerInfo.showStatus === '' || routerInfo.showStatus === null || routerInfo.showStatus === undefined) {
          that.$message({
            message: '请选择路由状态',
            type: 'warning'
          })
        } else if (routerInfo.type === '' || routerInfo.type === null || routerInfo.type === undefined) {
          that.$message({
            message: '请选择路由类型',
            type: 'warning'
          })
        } else if (routerInfo.userType === '' || routerInfo.userType === null || routerInfo.userType === undefined) {
          that.$message({
            message: '请选择用户权限',
            type: 'warning'
          })
        } else if (routerInfo.info === '' || routerInfo.info === null || routerInfo.info === undefined) {
          that.$message({
            message: '请输入标题信息',
            type: 'warning'
          })
        } else {
          if (routerInfo.type === 2 || routerInfo.type === 3) {
            if (routerInfo.scoreType === '' || routerInfo.scoreType === null || routerInfo.scoreType === undefined) {
              that.$message({
                message: '请选择分数类型',
                type: 'warning'
              })
            } else if (routerInfo.baseScore === '' || routerInfo.baseScore === null || routerInfo.baseScore === undefined) {
              that.$message({
                message: '请输入基础分',
                type: 'warning'
              })
            } else if (routerInfo.maxScore === '' || routerInfo.maxScore === null || routerInfo.maxScore === undefined) {
              that.$message({
                message: '请输入最高分',
                type: 'warning'
              })
            } else if (routerInfo.minScore === '' || routerInfo.minScore === null || routerInfo.minScore === undefined) {
              that.$message({
                message: '请输入最低分',
                type: 'warning'
              })
            } else {
            // 开始提交
              that.addList()
            }
          } else {
            that.routerInfomation.scoreType = 1
            if (routerInfo.type !== 5) {
              if (routerInfo.baseScore === '' || routerInfo.baseScore === null || routerInfo.baseScore === undefined) {
                that.$message({
                  message: '请输入基础分',
                  type: 'warning'
                })
              } else if (routerInfo.maxScore === '' || routerInfo.maxScore === null || routerInfo.maxScore === undefined) {
                that.$message({
                  message: '请输入最高分',
                  type: 'warning'
                })
              } else if (routerInfo.minScore === '' || routerInfo.minScore === null || routerInfo.minScore === undefined) {
                that.$message({
                  message: '请输入最低分',
                  type: 'warning'
                })
              } else {
              // 开始提交
                that.addList()
              }
            } else {
              that.routerInfomation.maxScore = 99999
              that.routerInfomation.minScore = -99999
              // 开始提交
              that.addList()
            }
          }
        }
      }
    },
    addList() {
      var that = this
      var routerInfomation = this.routerInfomation
      if (routerInfomation.level === 2) {
        const slist = {
          slistBaseScore: routerInfomation.baseScore,
          slistFlistId: routerInfomation.flistId,
          slistInfo: routerInfomation.info,
          slistMaxScore: routerInfomation.maxScore,
          slistMinScore: routerInfomation.minScore,
          slistName: routerInfomation.name,
          slistPath: routerInfomation.path,
          slistPosition: routerInfomation.position,
          slistScoreType: routerInfomation.scoreType,
          slistStatus: routerInfomation.showStatus,
          slistType: routerInfomation.type,
          slistUserType: routerInfomation.userType,
          slistIconWeb: 'fa fa-comment-o'
        }
        addSlist(slist).then((res) => {
          that.appendInfo()
        })
      } else if (routerInfomation.level === 3) {
        const tlist = {
          tlistBaseScore: routerInfomation.baseScore,
          tlistSlistId: routerInfomation.slistId,
          tlistInfo: routerInfomation.info,
          tlistMaxScore: routerInfomation.maxScore,
          tlistMinScore: routerInfomation.minScore,
          tlistName: routerInfomation.name,
          tlistPath: routerInfomation.path,
          tlistPosition: routerInfomation.position,
          tlistScoreType: routerInfomation.scoreType,
          tlistStatus: routerInfomation.showStatus,
          tlistType: routerInfomation.type,
          tlistUserType: routerInfomation.userType,
          tlistIconWeb: 'fa fa-comment-o'
        }
        addTlist(tlist).then((res) => { that.appendInfo() })
      } else if (routerInfomation.level === 1) {
        const flist = {
          flistBaseScore: routerInfomation.baseScore,
          flistMaxScore: routerInfomation.maxScore,
          flistMinScore: routerInfomation.minScore,
          flistName: routerInfomation.name,
          flistPath: routerInfomation.path,
          flistPosition: routerInfomation.position,
          flistStatus: routerInfomation.showStatus,
          flistIconWeb: 'fa fa-comment-o'
        }
        addFlist(flist).then((res) => { that.appendInfo(1) })
      }
    },
    appendInfo(level) {
      var routerInfoSession = this.routerInfoSession
      var newChild = this.routerInfomation
      if (level === 1) {
        this.routerInfo.push(newChild)
      } else {
        if (!routerInfoSession.child) {
          this.$set(routerInfoSession, 'child', [])
        }
        routerInfoSession.child.push(newChild)
      }

      this.showInfo = false
      this.$emit('reloadInfo', 0)
    }
  }
}
</script>
<style lang="scss" scoped>
.show-router-info-button{
  width: 100%;
  text-align: left;
}
</style>
